<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>AngularJs的循环</title>
    <script src="../js/angular.min.js" type="text/javascript"></script>
</head>
<body>
    <div ng-app="myapp" ng-controller="myctrl">
        <table width="50%">
            <tr>
                <td>序号</td>
                <td>商品名称</td>
                <td>商品价格</td>
                <td>商品编号</td>
            </tr>
            <tr ng-repeat="product in products">
                <td >{{$index+1}}</td>
                <td>{{product.name}}</td>
                <td>{{product.price}}</td>
                <td>{{product.id}}</td>
            </tr>
        </table>
        <script type="text/javascript">
            var myapp=angular.module("myapp",[]);
            myapp.controller("myctrl",["$scope",function ($scope) {
                $scope.products=[
                    {
                        id:8955,
                        price:8999,
                        name:"Iphone8"
                    },
                    {
                        id:8848,
                        price:5999,
                        name:"Iwatch"
                    }
                ];
            }]);
        </script>

    </div>
</body>
</html>